<!DOCTYPE html>
<html lang=zh-CN>
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta property="og:description" content="伍一的笔记，Kool&#39;s Blog">
    <meta property="og:type" content="website">
    <meta name="description" content="伍一的笔记，Kool&#39;s Blog">
    <meta name="keyword"  content="伍一,伍一的博客">
    <link rel="shortcut icon" href="/img/favicon.ico">

    <title>
        
        在hexo博客里添加自定义html网页并且实现商品条码解析 - 伍一的笔记 | Kool&#39;s Blog
        
    </title>

    <!-- Custom CSS -->
    
<link rel="stylesheet" href="/css/aircloud.css">

    
<link rel="stylesheet" href="/css/gitment.css">

    <!--<link rel="stylesheet" href="https://imsun.github.io/gitment/style/default.css">-->
    <link href="//at.alicdn.com/t/font_620856_28hi1hpxx24.css" rel="stylesheet" type="text/css">
    <!-- ga & ba script hoook -->
    <script></script>

    







  
  
  
    <script type="text/javascript">
      var _hmt = _hmt || []
      ;(function () {
        var hm = document.createElement('script')
        hm.src = 'https://hm.baidu.com/hm.js?7e771422dc6f742629fa26747480f822'
        var s = document.getElementsByTagName('script')[0]
        s.parentNode.insertBefore(hm, s)
      })()
    </script>
  



<meta name="generator" content="Hexo 6.3.0"></head>

<body>

<div class="site-nav-toggle" id="site-nav-toggle">
    <button>
        <span class="btn-bar"></span>
        <span class="btn-bar"></span>
        <span class="btn-bar"></span>
    </button>
</div>

<div class="index-about">
    <i> 爱生活爱编码 </i>
</div>

<div class="index-container">
    
    <div class="index-left">
        
<div class="nav" id="nav">
    <div class="avatar-name">
        <div class="avatar radius">
            <img src="/img/zkool.png" />
        </div>
        <div class="name">
            <i>伍一</i>
        </div>
    </div>
    <div class="contents" id="nav-content">
        <ul>
            <li >
                <a href="/">
                    <i class="iconfont icon-shouye1"></i>
                    <span>主页</span>
                </a>
            </li>
            <li >
                <a href="/html/scanner/index.html">
                    <i class="iconfont icon-guidang2"></i>
                    <span>H5条码枪</span>
                </a>
            </li>
            <li >
                <a href="/html/udi/index.html">
                    <i class="iconfont icon-sousuo1"></i>
                    <span>UDI</span>
                </a>
            </li>
            <li >
                <a href="/tags">
                    <i class="iconfont icon-biaoqian1"></i>
                    <span>标签</span>
                </a>
            </li>
            <li >
                <a href="/archives">
                    <i class="iconfont icon-guidang2"></i>
                    <span>存档</span>
                </a>
            </li>
            <li >
                <a href="/collect/">
                    <i class="iconfont icon-shoucang1"></i>
                    <span>收藏</span>
                </a>
            </li>
            <li >
                <a href="/about/">
                    <i class="iconfont icon-guanyu2"></i>
                    <span>关于</span>
                </a>
            </li>
            
            <li>
                <a id="search">
                    <i class="iconfont icon-sousuo1"></i>
                    <span>搜索</span>
                </a>
            </li>
            
        </ul>
    </div>
    
        <div id="toc" class="toc-article">
    <ol class="toc"><li class="toc-item toc-level-1"><a class="toc-link" href="#%E9%9C%80%E6%B1%82"><span class="toc-text">需求</span></a></li><li class="toc-item toc-level-1"><a class="toc-link" href="#%E4%BB%BB%E5%8A%A1%E8%A7%A3%E6%9E%90"><span class="toc-text">任务解析</span></a></li><li class="toc-item toc-level-1"><a class="toc-link" href="#%E5%AE%9E%E6%88%98"><span class="toc-text">实战</span></a></li></ol>
</div>
    
</div>


<div class="search-field" id="search-field">
    <div class="search-bg" id="search-bg"></div>
    <div class="search-container">
        <div class="search-input">
            <span id="esc-search"> <i class="icon-fanhui iconfont"></i></span>
            <input id="search-input"/>
            <span id="begin-search">搜索</span>
        </div>
        <div class="search-result-container" id="search-result-container">

        </div>
    </div>
</div>

        <div class="index-about-mobile">
            <i> 爱生活爱编码 </i>
        </div>
    </div>
    
    <div class="index-middle">
        <!-- Main Content -->
        


<div class="post-container">
    <div class="post-title">
        在hexo博客里添加自定义html网页并且实现商品条码解析
    </div>

    <div class="post-meta">
        <span class="attr">发布于：<span>2023-12-26 22:05:55</span></span>
        
        <span class="attr">标签：/
        
        <a class="tag" href="/tags/#编程综合" title="编程综合">编程综合</a>
        <span>/</span>
        
        
        </span>
        <span class="attr">访问：<span id="busuanzi_value_page_pv"></span>
</span>
</span>
    </div>
    <div class="post-content ">
        <p>注意看标题是在hexo博客内自定义html页面，不是md文件。</p>
<h1 id="需求"><a href="#需求" class="headerlink" title="需求"></a>需求</h1><p>hexo博客内支持添加自定义html网页，网页内容是实现商品条码解析功能</p>
<h1 id="任务解析"><a href="#任务解析" class="headerlink" title="任务解析"></a>任务解析</h1><ul>
<li>在hexo的框架下能自定义html吗？能，hexo虽然是写markdown文档，但最后还是编译成html了。</li>
<li>怎么手写html网页呢，用什么技术？</li>
<li>商品条码能解析出什么？</li>
</ul>
<h1 id="实战"><a href="#实战" class="headerlink" title="实战"></a>实战</h1><ul>
<li>hexo框架下如何自定义html直接度娘后方法如下：</li>
</ul>
<ol>
<li><p>首先在博客根目录的source文件夹下，新建一个文件夹用于存放要部署的html文件&#x20;</p>
</li>
<li><p>然后在博客根目录的配置文件_config.yml文件里，设置跳过渲染</p>
<pre><code>skip_render: 
  # 跳过单个文件
  &quot;xxxx.html&quot;
  # 跳过文件夹下所有文件
  &quot;文件夹名/*&quot;
  # 跳过子文件夹
  &quot;文件夹名/子文件夹名/*&quot;
  # 跳过文件夹下所有子文件夹和文件
  &quot;文件夹名/**&quot; 
</code></pre>
</li>
<li><p>最后处理css、js文件 因为hexo部署的是静态文件，所有文章的md文件会被渲染成html文件， hexo会帮我们把所有css、js文件都加到文章里，我们之前跳过了渲染，所以就需要手动把css、js整合到html文件里，找到添加的html文件的首页，找到添加的html文件的首页直接引入css,js即可</p>
<pre><code>&lt;link rel=&quot;stylesheet&quot; href=&quot;css/xxx.css&quot;&gt;
&lt;script src=&quot;js/xxx.js&quot;&gt;&lt;/script&gt;
</code></pre>
</li>
<li><p>&#x20;如果想将这些html的界面放到导航菜单栏上，那找到导航栏的位置，添加链接即</p>
<pre><code>menu:
   主页: / || fas fa-home
   标签: /tags/ || fas fa-tags
   Demo||fas fa-file-code:
     - myhtml-1 || /html/myhtml1.html || fas fa-code
     - myhtml-2 || /html/myhtml-2.html || fas fa-code
</code></pre>
</li>
</ol>
<ul>
<li><p>html网页技术</p>
<pre><code>1. html+css用皮肤的页面布局框架和bootstrap框架https://www.bootcss.com/
2. js+jquery简易人机交互
</code></pre>
</li>
</ul>
<!---->

<ul>
<li><p>解析商品条码</p>
<ol>
<li>条码可以解析出自身的商品信息，比如超市里扫码收银</li>
<li>有一种医疗商品条码自身还携带一些出厂的生产信息，比如生产日期，失效日期，生产批号，序列码等等</li>
</ol>
</li>
<li><p>视频介绍地址：<a target="_blank" rel="noopener" href="https://www.bilibili.com/video/BV1fN4y147r6">https://www.bilibili.com/video/BV1fN4y147r6</a></p>
</li>
</ul>

        
            <div class="donate-container">
    <div class="donate-button">
        <button id="donate-button">赞赏</button>
    </div>
    <div class="donate-img-container hide" id="donate-img-container">
        <img id="donate-img" src="" data-src="/img/my_wechat.jpg">
        <p> 感谢鼓励 </p>
    </div>
</div>
        
        <br />
        <div id="comment-container">
        </div>
        <div id="disqus_thread"></div>
        <div id="lv-container"></div>
        <div class="giscus"></div>
    </div>
</div>

    </div>
</div>


<footer class="footer">
    <ul class="list-inline text-center">
        
        

        
        <li>
            <a target="_blank" href="http://weibo.com/zha0ku1">
                            <span class="fa-stack fa-lg">
                                  <i class="iconfont icon-weibo"></i>
                            </span>
            </a>
        </li>
        

        

        
        <li>
            <a target="_blank"  href="https://github.com/zkool">
                            <span class="fa-stack fa-lg">
                                <i class="iconfont icon-github"></i>
                            </span>
            </a>
        </li>
        

        

    </ul>
    
    <p>
        <span>/</span>
        
        <span><a target="_blank" rel="noopener" href="https://niexiaotao.com">Xiaotao&#39;s Page</a></span>
        <span>/</span>
        
        <span><a href="#">It helps SEO</a></span>
        <span>/</span>
        
    </p>
    
    <p>
        <span id="busuanzi_container_site_pv">
            <span id="busuanzi_value_site_pv"></span>PV
        </span>
        <span id="busuanzi_container_site_uv">
            <span id="busuanzi_value_site_uv"></span>UV
        </span>
        Created By <a target="_blank" rel="noopener" href="https://hexo.io/">Hexo</a>  Theme <a target="_blank" rel="noopener" href="https://github.com/aircloud/hexo-theme-aircloud">AirCloud</a></p>
</footer>




</body>

<script>
    // We expose some of the variables needed by the front end
    window.hexo_search_path = "search.json"
    window.hexo_root = "/"
    window.isPost = true
</script>
<script src="https://cdn.bootcss.com/jquery/3.3.1/jquery.min.js"></script>

<script src="/js/index.js"></script>

<script async src="//busuanzi.ibruce.info/busuanzi/2.3/busuanzi.pure.mini.js"></script>






</html>
